@layout("/common/_container.html"){
<style>
    .nav_ul{
        border-bottom: 5px solid #30add2;
    }
    .nav_ul>li>a{
        color: #565656;
        border: 1px solid #dddddd;
    }
    .nav_table{
        margin-top: 10px;
    }
    .doctor_ul>li{
        float: left;
        margin-right: 20px;
    }
    .ul_flex{
        display: flex;
        padding: 0;
    }
    .ul_flex>li{
        flex: 1;
    }
    .ul_flex ul{
        padding: 0;
    }
    .ul_flex ul>li{
        line-height: 52px;
    }
    .ul_flex span{
        display: inline-block;
        width: 110px;
    }
    .home_box{
        border: 1px solid #cccccc;
        border-radius: 5px;
        overflow: hidden;
    }
    .btnBox{
        padding: 15px 0px 5px;
    }
    .btnBox button{
        background:#30add1;
        color: white;
        width: 75px;
    }
    .modify{
        height: 35px;
        border: none;
        width: 60%;
        border-radius: 3px;
        padding-left: 10px;
    }
    .select_styles {
        width: 60%;
        height: 35px;
        border-radius: 3px;
        border: none;
        padding-left: 10px;
        -webkit-appearance: none;
    }
    .nav-tabs > li.active > a,
    .nav-tabs > li.active > a:hover,
    .nav-tabs > li.active > a:focus {
        background: #30add2;
        border-bottom: 1px solid #30add2;
        color: white;
    }
</style>
<div class="ibox float-e-margins ">
    <div class="ibox-content">
        <div style="display: none">
            <input type="hidden" id="id" value="${reservationsInfo.id}">
            <input id="economicAbilityValue" type="hidden" name="经济能力"
                   value="${reservationsInfo.economicAbility}"/>
            <input id="occupationValue" type="hidden" name="职业"
                   value="${reservationsInfo.occupation}"/>
            <input type="hidden" id="customerSexValue" value="${reservationsInfo.customerSex}">
            <input type="hidden" id="isLargeValue" value="${reservationsInfo.isLarge}">
            <input type="hidden" id="oneMediumValue" value="${reservationsInfo.oneMedium}">
            <input type="hidden" id="twoMediumValue" value="${reservationsInfo.twoMedium}">
            <input type="hidden" id="thrMediumValue" value="${reservationsInfo.thrMedium}">
            <input type="hidden" id="oneChannelValue" value="${reservationsInfo.oneChannel}">
            <input type="hidden" id="twoChannelValue" value="${reservationsInfo.twoChannel}">
            <input type="hidden" id="thrChannelValue" value="${reservationsInfo.thrChannel}">
            <input type="hidden" id="outpatientNameValue" value="${reservationsInfo.outpatientName}">
            <input type="hidden" id="statusValue" value="${reservationsInfo.status}">
            <input type="hidden" id="payservicenameValue" value="${reservationsInfo.appointmentPayService}">
            <input type="hidden" id="phoneSharShipValue" value="${reservationsInfo.phoneSharShip}">
            <input type="hidden" id="accessDiseaseValue" value="${reservationsInfo.accessDisease}">
            <input type="hidden" id="maritalStatus" value="${reservationsInfo.maritalStatus}">
            <input type="hidden" id="sortMap" value="">
        </div>
        <div class="row" style="background: #f7f7f7;border: 1px solid #dddddd;border-radius: 3px;">
            <h4 style="margin-top: 25px;"><span style="margin-left: 10px;">客户姓名：${reservationsInfo.customerName}</span></h4>
        </div>
        <div class="row">
            <div class="nav_table" id="reservationsInfoForm">
                <!-- Nav tabs -->
                <ul class="nav nav-tabs nav_ul" role="tablist" id="navBox">
                    <!--建档-->
                    <li role="presentation" class="active onRecord"><a href="#home" aria-controls="home" role="tab" data-toggle="tab">患者信息</a></li>
                </ul>
                <!-- Tab panes -->
                <div class="tab-content content_box" id="contentBox">
                    <!--建档-->
                    <div role="tabpanel" class="tab-pane active onRecord" id="home" >
                        <div class="clearfix btnBox">
                            <div style="float: right;">
                                <button type="button" class="btn" onclick="ReservationsInfoDlg.getEdit()">编辑</button>
                                <button type="button" class="btn" onclick="ReservationsInfoDlg.deleteReservations()">删除</button>
                                <button type="button" class="btn" onclick="ReservationsInfoDlg.close()">取消</button>
                            </div>
                        </div>
                        <div class="home_box">
                            <div style="padding: 10px;overflow: hidden;">
                                <div class="col-sm-12" style="border-bottom: 1px solid #cccccc"><h4>个人信息</h4></div>
                                <div class="col-sm-12">
                                    <ul class="ul_flex col-sm-8">
                                        <li>
                                            <ul>
                                                <li><span>预约号：</span><input type="text" class="modify" id="reservationsNum" value="${reservationsInfo.reservationsNum}"></li>
                                                <li><span>姓名：</span><input type="text" class="modify" id="customerName" value="${reservationsInfo.customerName}"></li>
                                                <li><span>年龄：</span><input type="text" oninput="value=value.replace(/[^\d]/g,'')" maxlength="3"
                                                                           class="modify" id="customerAge" value="${reservationsInfo.customerAge}"></li>
                                                <li><span>电话：</span><input type="text" class="modify" id="customerPhone" value="${reservationsInfo.customerPhone}"></li>
                                                <li><span>电话使用人：</span><select class="select_styles" name="phoneSharShip" id="phoneSharShip">
                                                    <option value="本人">本人</option>
                                                    <option value="爸爸">爸爸</option>
                                                    <option value="妈妈">妈妈</option>
                                                    <option value="儿子">儿子</option>
                                                    <option value="女儿">女儿</option>
                                                    <option value="朋友">朋友</option>
                                                    <option value="其他">其他</option>
                                                </select></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <ul>
                                                <li><span>性别：</span><select class="select_styles" name="customerSex" id="customerSex">
                                                    <option value="1">男</option>
                                                    <option value="2">女</option>
                                                </select></li>
                                                <li><span>状态：</span><select class="select_styles" name="statuss" id="statuss">
                                                    <option value="预约">预约</option>
                                                    <option value="待定">待定</option>
                                                    <option value="跟进">跟进</option>
                                                    <option value="过期">过期</option>
                                                </select></li>
                                                <li><span>QQ号：</span><input type="text" oninput="value=value.replace(/[^\d]/g,'')"
                                                                            class="modify" id="qqNumber" value="${reservationsInfo.qqNumber}"></li>
                                                <li><span>微信号：</span><input type="text" class="modify" id="wechatNumber" value="${reservationsInfo.wechatNumber}"></li>
                                                <li id="phone2" hidden="hidden">
                                                    <span>电话2：</span><input type="text" class="modify1" id="customerPhone2" oninput="value=value.replace(/[^\d]/g,'')">
                                                </li>
                                                <li>
                                                    <span>关键词：</span><input type="text" class="modify1" id="keyWord"
                                                                            value="${reservationsInfo.keyWord}">
                                                </li>
                                            </ul>
                                        </li>
                                    </ul>
                                    <div class="col-sm-4"></div>
                                </div>
                            </div>
                            <div style="padding: 10px;overflow: hidden;">
                                <div class="col-sm-12" style="border-bottom: 1px solid #cccccc"><h4>项目信息</h4></div>
                                <div class="col-sm-12">
                                    <ul class="ul_flex">
                                        <li>
                                            <ul>
                                                <li><span>访问病种：</span><select class="select_styles" name="accessDisease" id="accessDisease">
                                                    <option value="">请选择</option>
                                                    <option value="种植">种植</option>
                                                    <option value="正畸">正畸</option>
                                                    <option value="修复">修复</option>
                                                    <option value="美白">美白</option>
                                                    <option value="拔牙智齿">拔牙智齿</option>
                                                    <option value="牙周">牙周</option>
                                                    <option value="洗牙洁牙">洗牙洁牙</option>
                                                    <option value="医院类">医院类</option>
                                                    <option value="儿童齿科">儿童齿科</option>
                                                </select></li>
                                                <li><span>预约门诊：</span><select class="select_styles" name="outpatientName" id="outpatientName"></select></li>
                                                <li><span>是否大单：</span><select class="select_styles" name="isLarge" id="isLarge">
                                                    <option value="1">是</option>
                                                    <option value="2">否</option>
                                                </select></li>
                                                <li><span>一级渠道：</span><select class="select_styles" name="oneChannel" id="oneChannel"></select></li>
                                                <li><span>一级媒介：</span><select class="select_styles" name="oneMedium" id="oneMedium"></select></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <ul>
                                                <li><span>预约项目：</span><select class="select_styles" name="appointmentPayService" id="appointmentPayService"></select></li>
                                                <li><span>建档人：</span><input type="text" readonly="readonly" style="width: 60%;height: 35px;border-radius: 3px;border: none;" id="archiving" value="${reservationsInfo.archiving}"></li>
                                                <li><span>经济能力：</span><select class="select_styles" name="economicAbility" id="economicAbility"></select></li>
                                                <li><span>二级渠道：</span><select class="select_styles" name="twoChannel" id="twoChannel"></select></li>
                                                <li><span>二级媒介：</span><select class="select_styles" name="twoMedium" id="twoMedium"></select></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <ul>
                                                <li><span>预约时间：</span><input type="text" class="modify" id="appointmentArrivalTime"
                                                                             value="${reservationsInfo.appointmentArrivalTime}" onfocus="laydate({istiem:true,format:'YYYY-MM-DD hh:mm:ss'})"></li>
                                                <li><span>障碍点：</span><input type="text" class="modify" id="obstaclePoint" value="${reservationsInfo.obstaclePoint}"></li>
                                                <li><span>职业：</span><select class="select_styles" name="occupation" id="occupation"></select></li>
                                                <li><span>三级渠道：</span><select class="select_styles" name="thrChannel" id="thrChannel"></select></li>
                                                <li><span>三级媒介：</span><select class="select_styles" name="thrMedium" id="thrMedium"></select></li>
                                            </ul>
                                        </li>
                                        <li>
                                            <ul>
                                                <li><span>部门：</span><input type="text" class="modify"
                                                                           id="department"
                                                                           value="${reservationsInfo.department}">
                                                </li>
                                                <li><span>归属人：</span>
                                                    @if(shiro.hasPermission("/reservations/updateBelonger")){
                                                    <input type="text" class="modify" name="belonger" id="belonger1"
                                                           value="${reservationsInfo.belonger}">
                                                    @}
                                                    @if(shiro.hasPermission("/reservations/notupdateBelonger")){
                                                    <input type="text" class="belonger" id="belonger2"
                                                           name="belonger" readonly="readonly" style="border: none"
                                                           value="${reservationsInfo.belonger}">
                                                    @}
                                                </li>
                                            </ul>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-12">
                                    <ul style="padding-left: 10px;">
                                        <li>
                                            <p>备注</p>
                                            <textarea id="remarks" name="remarks" readOnly="readOnly" rows="6" style="width: 75%">${reservationsInfo.remarks}</textarea>
                                        </li>
                                        <li style="margin-top: 14px;">
                                            <p>聊天记录</p>
                                            <textarea id="content" name="content" readOnly="readOnly" rows="6" style="width: 75%">${reservationsInfo.content}</textarea>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-12">
                                    <div class="btnBox">
                                        <button type="button" class="btn" style="margin-left: 1%" onclick="ReservationsInfoDlg.editSubmit()">保存</button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<script src="${ctxPath}/static/modular/marketing/reservations/reservations_info.js"></script>
<script src="${ctxPath}/static/js/common/jsChannel.js"></script>
<script src="${ctxPath}/static/js/common/jsMedium.js"></script>
<script type="text/javascript">
    var oneChanneli = document.getElementById("oneChannelValue").value;
    var twoChanneli = document.getElementById("twoChannelValue").value;
    var thrChanneli = document.getElementById("thrChannelValue").value;
    var oneMediumi = document.getElementById("oneMediumValue").value;
    var twoMediumi = document.getElementById("twoMediumValue").value;
    var thrMediumi = document.getElementById("thrMediumValue").value;
    //初始化下拉渠道列表
    $.post(Feng.ctxPath + "/channel/getChannelsss", function (data) {
        ChannelList = data;
        channelInit('oneChannel', 'twoChannel', 'thrChannel');
    }, "json");
    //初始化下拉媒介列表
    $.post(Feng.ctxPath + "/medium/getMedium", function (data) {
        MediumList = data;
        mediumInit('oneMedium', 'twoMedium', 'thrMedium');
    }, "json");
</script>
@}